﻿@*@model IEnumerable<CTM.Web.Models.View.Conversation.ConversationViewModel>*@

@{
    ViewBag.Title = "My Notes";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>My Notes</h2>

<form class="form-inline">
    <div class="form-group">
        <label>Year</label>
        <input type="text" class="form-control" />
    </div>
    <div class="form-group">
        <label>Keyword</label>
        <input type="text" class="form-control" />
    </div>
    <button type="button" class="btn btn-primary">
        <span class="glyphicon glyphicon-search"></span> Search
    </button>
</form>

<div class="table-responsive">
    <table class="table table-condensed">
        <!--<caption>Optional table caption.</caption>-->
        <thead>
            <tr>
                <th>#</th>
                <th>Date</th>
                <th>Tags</th>
                <th>Comments</th>
                <th>
                    <a class="btn btn-primary btn-xs" href="#" data-toggle="modal" data-target=".modal-note">
                        <span class="glyphicon glyphicon-plus"></span>
                    </a>
                </th>
            </tr>
        </thead>
        <tbody>
            <tr data-target=".bs-example-modal-lg" data-toggle="modal">
                <th scope="row">1</th>
                <td>Jul 25, 2015</td>
                <td>
                    <span class="label label-success">Projects</span>
                    <span class="label label-primary">Careers</span>
                    <span class="label label-danger">Own development</span>
                </td>
                <td>Server problem</td>
                <td>
                    <a href="#" class="btn btn-warning btn-xs">
                        <span class="glyphicon glyphicon-pencil"></span>
                    </a>
                    <a href="#" class="btn btn-danger btn-xs">
                        <span class="glyphicon glyphicon-trash"></span>
                    </a>
                </td>
            </tr>
            <tr data-target=".bs-example-modal-lg" data-toggle="modal">
                <th scope="row">2</th>
                <td>Jul 25, 2015</td>
                <td>
                    <span class="label label-primary">Careers</span>
                </td>
                <td>Paypal Issue...</td>
                <td>
                    <a href="#" class="btn btn-warning btn-xs">
                        <span class="glyphicon glyphicon-pencil"></span>
                    </a>
                    <a href="#" class="btn btn-danger btn-xs">
                        <span class="glyphicon glyphicon-trash"></span>
                    </a>
                </td>
            </tr>
            <tr data-target=".bs-example-modal-lg" data-toggle="modal">
                <th scope="row">3</th>
                <td>Jul 25, 2015</td>
                <td>
                    <span class="label label-danger">Own development</span>
                </td>
                <td>IE7 Problem</td>
                <td>
                    <a href="#" class="btn btn-warning btn-xs">
                        <span class="glyphicon glyphicon-pencil"></span>
                    </a>
                    <a href="#" class="btn btn-danger btn-xs">
                        <span class="glyphicon glyphicon-trash"></span>
                    </a>
                </td>
            </tr>
            <tr data-target=".bs-example-modal-lg" data-toggle="modal">
                <th scope="row">4</th>
                <td>Jul 25, 2015</td>
                <td>
                    <span class="label label-warning">Uncategorized</span>
                </td>
                <td>Mobile App Problem</td>
                <td>
                    <a href="#" class="btn btn-warning btn-xs">
                        <span class="glyphicon glyphicon-pencil"></span>
                    </a>
                    <a href="#" class="btn btn-danger btn-xs">
                        <span class="glyphicon glyphicon-trash"></span>
                    </a>
                </td>
            </tr>
        </tbody>
    </table>
</div>

<!-- Modal Note -->
<form class="modal modal-note fade form-horizontal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">New Note</h4>
            </div>
            <div class="modal-body">
                <div class="form-group">
                    <label class="col-lg-4 control-label">Tags</label>
                    <div class="col-lg-8">
                        <input type="text" class="form-control" />
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-lg-4 control-label">Comment</label>
                    <div class="col-lg-8">
                        <textarea class="form-control"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Submit</button>
            </div>
        </div>
    </div>
</form>